<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>积分</title>
    <link rel="stylesheet" href="../../media/com/css/layer.css">
    <link rel="stylesheet" href="../../media/tea/css/jifen/index.css">
    <link rel="stylesheet" href="../../media/tea/css/jifen/mui_picker.css">
</head>
<body>
<header>
	<div id="head">
		<a href="presentCenter4.html" class="back"><span class="iconfont icon-zuojiantou"></span></a>
		填写收货地址
	</div>
</header>
<section>
	<div id="form">
		<div class="produce-adres">
			<div class="title"><span class="iconfont icon-xin"></span>温馨提示：</div>
			<p>礼品兑换后，除质量问题外概不退换。如因收货信息填写错误，造成无法收到礼品概不补发。如有问题可拨打客服电话12556185咨询。</p>
		</div>
		<div class="tit-nav">联系人</div>
		<div class="inp"><label>姓名:</label><input type="text" datatype="*" nullmsg="请输入用户名！0" placeholder="请填写收货人的姓名" autocomplete="on" id="name" value="00" /></div>
		<div class="inp"><label>手机:</label><input type="text" datatype="m" nullmsg="请输入手机号！" errormsg="手机号码格式不正确！" id="mobile" placeholder="请填写收货人手机号码" autocomplete="on" value="15139413976" /></div>
		<div class="tit-nav">收货地址</div>
		<div class="inp"><label>地区:</label>
			<span class="iconfont icon-dingwei"></span>
			<input type="text" datatype="*" nullmsg="请输入收货地区！" id="showCityPicker" class="showCityPicker" readonly="readonly" placeholder="点击选择" value="" />
			<span class="iconfont icon-jiantouyou"></span>
		</div>
		<div class="inp"><label>地址:</label><input type="text" datatype="*" nullmsg="请输入收货地址！" placeholder="请填写您所在的街道地址" autocomplete="on" id="adres" value="000" /></div>
		<input type="submit" name="" id="submit" value="提交订单" class="sub" />
		<!--<a href="https://www.baidu.com" id="submit" class="sub">百度</a>-->
	</div>
</section>
</body>
<script type="text/javascript" src="../../media/com/js/zepto.js"></script>
<script type="text/javascript" src="../../media/com/js/common.js"></script>
<script src="{{settings.MEDIA_URLROOT}}/{{settings.DIR}}/wap/js/mui.min.js"></script>
<script src="{{settings.MEDIA_URLROOT}}/{{settings.DIR}}/wap/js/mui.picker.js"></script>
<script src="{{settings.MEDIA_URLROOT}}/{{settings.DIR}}/wap/js/area.js"></script>
<script src="{{settings.MEDIA_URLROOT}}/{{settings.DIR}}/wap/js/jifen/jquery-1.9.1.min.js"></script>
<script src="{{settings.MEDIA_URLROOT}}/{{settings.DIR}}/wap/js/jifen/Validform_v5.3.2.js"></script>
<script src="{{settings.MEDIA_URLROOT}}/{{settings.DIR}}/wap/js/layer.js"></script>
<script src="{{settings.MEDIA_URLROOT}}/{{settings.DIR}}/wap/js/jifen/index.js"></script>
<script type="text/javascript">
	$(function() {
		if(($("#name").val() != "") && ($("#mobile").val() != "") && ($("#showCityPicker").val() != "") && ($("#adres").val() != "")) {
			$(".sub").css({
				"background": "#26bced",
				"color": "#fff"
			});
		} else {
			$(".sub").css({
				"background": "#83ddff",
				"color": "#c1edfe"
			});
		}

		//。。。。。。。。。。。。。。。。
		(function($, doc) {
			$.init();
			$.ready(function() {
				var cityPicker = new $.PopPicker({
					layer: 3
				});
				cityPicker.setData(city);
				var showCityPickerButton1 = doc.getElementById('showCityPicker');
				showCityPickerButton1.addEventListener('tap', function(event) {
					cityPicker.show(function(items) {
						showCityPickerButton1.value = items[0].text + " " + items[1].text + " " + items[2].text;
					});
				}, false);
			});
		})(mui, document);

		$("#name").blur(function() {
			exist();
		});
		$("#mobile").blur(function() {
			exist();
		});
		$("#showCityPicker").blur(function() {
			exist();
		});
		$("#adres").keyup(function() {
			exist();
		});

		function exist() {
			var num = 0;
			if($("#name").val() != "") {
				num++;
			}
			if($("#mobile").val() != "") {
				num++;
			}
			if($("#showCityPicker").val() != "") {
				num++;
			}
			if($("#adres").val() != "") {
				num++;
			}
			if(num == 4) {
				$(".sub").css({
					"background": "#26bced",
					"color": "#fff"
				});
			} else {
				$(".sub").css({
					"background": "#83ddff",
					"color": "#c1edfe"
				});
			}
		}

	})

	//     表单验证
	$("#form").Validform({
		btnSubmit: "#submit",
		tipSweep: true,
		tiptype: function(msg) {
			layer.open({
				title: "",
				content: msg,
				btn: ['确定'],
				shadeClose: true
			});
		},

	});
</script>
	</html>

